﻿<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="HomeHeader.ascx.cs" Inherits="SonCa.SN.ASCX.HomeHeader" %>

<%@ Register Src="~/ASCX/ChangePassword.ascx" TagName="ChangePassword" TagPrefix="ucChangePass" %>

<script type="text/javascript">
    $(document).ready(function () {
        $(".result-block").hide();
        $(".dropdown-menu").hide();

        var IsMouseInside = false;

        $(".result-block").hover(function () {
            IsMouseInside = true;
        }, function () {
            IsMouseInside = false;
        });

        $(".dropdown-menu").hover(function () {
            IsMouseInside = true;
        }, function () {
            IsMouseInside = false;
        });

        $("body").mouseup(function () {
            if (!IsMouseInside) {
                $(".result-block").hide();
                $(".dropdown-menu").hide();
            }
        });

        $('.show-hide-friend').click(function () {
            $('#messages-list').load("../Friends/FriendsRequest.aspx");
            $(".result-block").slideToggle();
            $('#lblCountInviteFriend').text("");
        });

        $('#linkUserName').click(function () {
            $("#dropdown-linkusername").slideToggle();
        });

        $("#linkChangePassword").click(function () {
            $('#popupChangePassword').fadeIn(300);

            var popMargTop = ($('#popupChangePassword').height() + 24) / 2;
            var popMargLeft = ($('#popupChangePassword').width() + 24) / 2;

            $('#popupChangePassword').css({
                'margin-top': -popMargTop,
                'margin-left': -popMargLeft
            });

            $('body').append('<div id="mask_changepass"></div>');
            $('#mask_changepass').fadeIn(300);

            return false;
        });

        $('a.close_popup_changepass, #mask_changepass').live('click', function () {
            $('#mask_changepass , .popupChangePassword_box').fadeOut(300, function () {
                $('#mask_changepass').remove();
            });
            return false;
        });

        $("#btnSearch").click(function () {
            SearchFriend();
        });

        $("#txtSearch").keyup(function () {
            SearchFriend();
        });

        $("#show_hide_message").click(function () {
            var accountID = $('#hdfAccoutnID').val();
            $.ajax({
                type: "post",
                url: "../Services/AjaxService.svc/LoadMessage",
                data: '{"accountID": "' + accountID + '"}',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                beforeSend: function () {

                },
                success: function (html) {
                    $('#lblCountMessage').text("");
                    $("#slide_message").html(html.d);
                    $("#slide_message").slideDown();
                },
                error: function () { }
            });
        });

        setInterval("AutoRefreshCounter()", 10000);

        //setInterval("AutoRefreshCountMessage()", 8000);
    });

    function AutoRefreshCounter() {
        var accountID = $('#hdfAccoutnID').val();
        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            data: '{"accountID": "' + accountID + '"}',
            url: "../Services/AjaxService.svc/RefreshCounter",
            dataType: "json",
            success: function (reponse) {
                if (reponse.d != "0") $('#lblCountInviteFriend').text(reponse.d);
                else $('#lblCountInviteFriend').text("");
            },
            error: function () { }
        })
    };

//    function AutoRefreshCountMessage() {
//        var accountID = $('#hdfAccoutnID').val();
//        $.ajax({
//            type: "post",
//            url: "../Services/AjaxService.svc/RefreshCountMessage",
//            data: '{"accountID": "' + accountID + '"}',
//            contentType: "application/json; charset=utf-8",
//            dataType: "json",
//            success: function (mes) {
//                if (mes.d != "0")
//                    $('#lblCountMessage').text(mes.d);
//                else
//                    $('#lblCountMessage').text("");
//            },
//            error: function () { }
//        });
//    }

    function Logout() {        
        $.ajax(
        {
            type: "POST",
            url: "../Services/AjaxService.svc/Logout",
            success: function () {
                window.location = "../Accounts/Login.aspx";
            }
        });
    }

    function SearchFriend() {
        var text_search = $("#txtSearch").val();
        if (text_search.length == 0) {
            $("#error_search").slideToggle();
            $("#txtSearch").focus();
            return false;
        }
        $.ajax({
            type: "post",
            url: "../Services/AjaxService.svc/SearchFriends",
            data: '{"text": "' + text_search + '"}',
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            beforeSend: function () {
                $("#loading_search").show();
            },
            success: function (html) {
                $("#result_search").html(html.d);
                $("#result_search").slideDown();
                $("#loading_search").hide();                
            },
            error: function () { }
        });
    }

    function AddFriend_Search(soThuTu, id) {
        $("#imgAddFriend_search_" + soThuTu).hide();
        $.ajax({
            type: "post",
            url: "../Services/AjaxService.svc/SendInvitationRequest",
            data: '{"accountID": "' + id + '"}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            beforeSend: function () {
                $("#loading_addfriend_search_" + soThuTu).show();
            },
            success: function () {
                $("#imgRequestSended_search_" + soThuTu).show();
                $("#loading_addfriend_search_" + soThuTu).hide();
            },
            error: function () { }
        });
    }
</script>

<!-- Popup Doi mat khau -->
<div id="popupChangePassword" class="popupChangePassword_box">
    <a href="#" class="close_popup_changepass"><img src="../img/close.png" class="btn_close" title="Close Window" alt="Close" /></a>
    <ucChangePass:ChangePassword ID="ChangePassword1" runat="server" />
</div>
<!-- End Popup Doi mat khau -->

<div class="navbar navbar-inverse" style="position: static;">
    <div class="navbar-inner">
        <div class="container">
            <a data-target=".navbar-inverse-collapse" data-toggle="collapse" class="btn btn-navbar">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </a>
            <img src="../img/logo.png" width="272" height="39" class="cpos_1" />
            <div class="box_search" style="position:relative">
                <input type="text" id="txtSearch" class="input_search" placeholder="Nhập từ khóa cần tìm kiếm......................................." />                
                <img class="button_search" id="btnSearch" />
                <img src="../img/loading.gif" id="loading_search" style="display:none;margin-left:10px;margin-top:5px" />                
                <div class="dropdown">
                    <div id="error_search" class="dropdown-menu">Xin nhập từ khóa tìm kiếm</div>                
                </div>
                <div id="result_search" class="dropdown-menu" style="display:none;width:366px;height:300px;overflow-y:scroll" align="center"></div>
            </div>            
            <div class="nav-collapse navbar-inverse-collapse in collapse" style="height: auto;">                    
                <%--<input value="fsdfsf" class="search-query span2" placeholder="Search" type="text" />--%>
                <ul class="nav pull-right">
                    <li class="divider-vertical"></li>
                    <li class="ketban">
                        <a href="#" class="show-hide-friend">
                            <span style=" color: Red;"><strong><asp:Label ID="lblCountInviteFriend" runat="server" ClientIDMode="Static"></asp:Label></strong></span>
                            <asp:HiddenField ID="hdfAccoutnID" runat="server" Value='<%# Eval("AccountID") %>' ClientIDMode="Static" />&nbsp;
                            <img src="../img/ketban.png" id="imgketban" />&nbsp;&nbsp;Kết bạn
                        </a>
	                    <div id="messages-list" class="result-block"></div>                                            
                    </li>
                    <li class="divider-vertical"></li>
                    <li class="dropdown">
                        <a href="#" id="show_hide_message">
                            <strong style="color:Red"><asp:Label ID="lblCountMessage" runat="server" ClientIDMode="Static"></asp:Label></strong>
                            <img src="../img/message.png" />
                            <span>Tin nhắn</span>
                        </a>
                        <div class="dropdown-menu" id="slide_message"></div>
                    </li>
                    <li class="divider-vertical"></li>
                    <li class="dropdown">
                        <a id="linkUserName" data-toggle="dropdown" class="dropdown-toggle" href="#"><asp:Label ID="lblLUserName" runat="server"></asp:Label><b class="caret"></b></a>
                        <ul class="dropdown-menu" id="dropdown-linkusername">
                            <li><a href="../Profiles/Profile.aspx">Trang chủ</a></li>
                            <li><a href="../Personals/PersonalPage.aspx">Trang cá nhân</a></li>                            
                            <li><a href="#" id="linkChangePassword">Đổi mật khẩu</a></li>
                            <li class="divider"></li>                            
                            <li><a href="#" onclick="Logout();">Thoát</a></li>
                            <li><a href="../Admin/MemberPage.aspx">Admin</a></li>
                        </ul>
                    </li>
                </ul>
            </div><!-- /.nav-collapse -->
        </div>
    </div><!-- /navbar-inner -->
 </div>